@import "../my-theme/info.less";
.schedule-content{
  width: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
  .schedule-title{
    display: flex;
    padding: 19px 36px 0;
    ul{
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      border-radius: 4px;
      overflow: hidden;
      line-height: 24px;
      height: 26px;
      border: 1px solid @orange-color;
      color: @orange-color;
      li{
        width: 70px;
        text-align: center;
        cursor: pointer;
        a{
          display: block;
        }
        &:first-child{
          border-right: 1px solid @orange-color;
        }
        &.active{
          background: @orange-color;
          color: #fff;
        }
      }
    }
  }
  .schedule-main{
    position: relative;
    -webkit-box-flex: 5;
    -ms-flex: 5;
    flex: 5;
    overflow: hidden;
    display: flex;
  }
  .schedule-date{
    padding: 12px 37px 0;
    position: relative;
    .schedule-date-main{
      display: flex;
      justify-content: center;
      font-size: 14px;
      color: #323741;
      span{
        margin: 0 11px;
        width: 130px;
        text-align: center;
        display: block;
      }
      i{
        font-size: 16px;
        cursor: pointer;
        &:hover{
          color: tint(#323741,20%);
        }
        &:active{
          color: shade(#323741,20%);
        }
      }
    }
    .schedule-download{
      position: absolute;
      right: 37px;
      top: 12px;
      .icon{
        color: @brown-color;
        cursor: pointer;
        &:hover{
          color: tint(@brown-color,20%);
        }
        &:active{
          color: shade(@brown-color,20%);
        }
      }
    }
  }
  .schedule-table-header{
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 2;
    background: #ebf6fb;
    i{
      height: 42px;
      position: absolute;
      right: 0;
      top: 0;
      width: 19px;
      background: rgba(253,93,64,0.15);
    }
  }
  .schedule-table-detail{
    position: relative;
    z-index: 1;
    width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
  }
  .schedule-week-main{
    display: flex;
    width: 100%;
    flex-direction: column;
    .schedule-table{
      width: 100%;
      display: flex;
      padding: 12px 37px 25px 37px;
      flex: 5;
      overflow: hidden;

      .card{
        overflow: hidden;
        background: #fff !important;
        border: 1px solid #ecf4f7;
        display: flex;
        width:100%;
        .schedule-table-main{
          position: relative;
          z-index: 1;
          overflow: hidden;
          display: flex;
          flex: 5;
          .ivu-table:before,.ivu-table:after{
            display: none;
          }
          .ivu-table-wrapper{
            border-radius: 4px;
            border: none;
          }
          .ivu-table{
            .ivu-table-body{
              overflow: hidden;
            }
            .ivu-table-row{
              td:last-child{
                border-right: 0;
                .ivu-table-cell{
                  &:after{
                    content: '';
                    background: #fff;
                    position: absolute;
                    right: 0;
                    bottom: -2px;
                    height: 1px;
                    width: 9px;
                  }
                }
              }
              td:first-child{
                .ivu-table-cell{
                  &:after{
                    content: '';
                    background: #fff;
                    position: absolute;
                    left: 0;
                    bottom: -2px;
                    height: 1px;
                    width: 9px;
                  }
                }
              }
            }
            .ivu-table-row:last-child{
              td{
                border-bottom: none;
              }
            }
            th,td{
              border-color: #f0e8e8;
            }
            th{
              height: 42px;
              text-align: center;
              font-size: 12px;
              font-weight: normal;
              border-bottom: none;
              background: rgba(232,78,101,0.05);
              border-right: 0;
              color: @brown-color;
              &:nth-of-type(even){
                background: rgba(253,93,64,0.15);
              }
            }
            td{
              height: 45px;
              .ivu-table-cell{
                height: 45px;
                position: relative;
                overflow: visible;
                padding: 0;
                h3{
                  line-height: 45px;
                  text-align: center;
                  font-size: 12px;
                  color: #92898c;
                }
              }
              .item{
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                color: #fff;
                padding: 2px;
                z-index: 3;
                &>div {
                  background: #e892ab;
                  border-radius: 3px;
                  height: 100%;
                  display: flex;
                  justify-content: center;
                  align-items: center;
                  flex-direction: column;
                  overflow: hidden;
                  position: relative;
                }
                &.sx{
                  &>div{
                    background: #9fc5f0;
                  }
                }
                &.yw{
                  &>div{
                    background: #e892ab;
                  }
                }
                &.sw{
                  &>div{
                    background: #d75e91;
                  }
                }
                &.dl{
                  &>div{
                    background: #86d2b1;
                  }
                }
                &.zz{
                  &>div{
                    background: #73cad7;
                  }
                }
                &.yy{
                  &>div{
                    background: #c4a5f2;
                  }
                }
                &.wl{
                  &>div{
                    background: #7375d7;
                  }
                }
                &.hx{
                  &>div{
                    background: #5fa8f1;
                  }
                }
                &.ls{
                  &>div{
                    background: #f59d87;
                  }
                }
                &.kx{
                  &>div{
                    background: #7687ef;
                  }
                }
                &.open{
                  transition: all .3s;
                  .itemName{
                    display: none;
                  }
                  &:hover{
                    height: 80px!important;
                    z-index: 4;
                    &>div{
                      box-shadow: 0 0 20px rgba(255,255,255,.8);
                    }
                    .itemName{
                      display: block;
                    }
                  }
                }
                em{
                  position: absolute;
                  top: 0;
                  right: 0;
                  font-size: 10px;
                  width: 20px;
                  height: 17px;
                  line-height: 17px;
                  text-align: center;
                  &.ce{
                    background-color: #fea947;
                  }
                  &.tiao{
                    background-color: #ff6592;
                  }
                }
              }
            }
          }
        }
      }
    }
  }
  .schedule-month-main{
    flex: 5;
    display: flex;
    flex-direction: column;
    padding: 0 37px 25px 37px;
    .schedule-date{
      padding: 12px 37px;
      .schedule-date-main{
        span{
          width: 80px;
        }
      }
      .schedule-download{
        right: 0;
      }
    }

    .schedule-table{
      width: 100%;
      display: flex;
      flex: 5;
      .card{
        display: flex;
        overflow: hidden;
        background: #fff !important;
        border: 1px solid #ecf4f7;
        .schedule-table-main{
          position: relative;
          z-index: 1;
          overflow: hidden;
          flex: 5;
          display: flex;
          .schedule-table-detail{
            display: flex;
            table{
              min-height: 100%;
              width: 100%;
              table-layout: fixed;
              thead{
                tr{
                    vertical-align: middle;
                }
              }
              tr{
                vertical-align: top;
                th{
                  font-weight:normal;
                  font-size: 12px;
                  height: 43px;
                  white-space: nowrap;
                  overflow: hidden;
                  border-right: 0;
                  background:rgba(232,78,101,0.05);
                  color: #727a89;
                  &:nth-of-type(even){
                    background: rgba(253,93,64,0.15);
                  }
                }
                td:last-child,th:last-child{
                  border-right: 0;
                  .table-cell{
                    &:after{
                      content: '';
                      background: #fff;
                      position: absolute;
                      right: 0;
                      top: -1px;
                      height: 1px;
                      width: 9px;
                    }
                  }
                }
                td:first-child{
                  .table-cell{
                    &:after{
                      content: '';
                      background: #fff;
                      position: absolute;
                      left: 0;
                      top: -1px;
                      height: 1px;
                      width: 9px;
                    }
                  }
                }
                td{
                  border-right: 1px solid #f0e8e8;
                  border-top: 1px solid #f0e8e8;
                  min-width: 0;
                  text-align: left;
                  text-overflow: ellipsis;
                  position: relative;
                  font-size: 12px;
                  .table-day{
                    text-align: right;
                    padding: 2px 2px 0 0;
                    line-height: 1;
                    min-height: 62px;
                    color: #a3acbe;
                    &.gray{
                      opacity: .3;
                    }
                  }
                  .table-cell{
                    padding: 0 10px 0 5px;
                    position: absolute;
                    width: 100%;
                    height: 100%;
                    top: 0;
                    left: 0;
                    .day-class-detail{
                      display: flex;
                      flex-direction: column;
                      height: 100%;
                      padding-bottom: 3px;
                      .day-class-total{
                        color: @orange-color;
                        line-height: 18px;
                        margin-bottom: 2px;
                      }
                      .day-class-list{
                        width: 100%;
                        flex: 5;
                        overflow: hidden;
                        transition: all .5s;
                        text-align: center;
                        &.open{
                          overflow: visible;
                          position: relative;
                          z-index: 1;
                          ul{
                            li{
                              display: block;
                            }
                          }
                        }
                        ul{
                          background: #feeeee;
                          border-radius: 3px;
                          position: relative;
                          li{
                            text-overflow: ellipsis;
                            white-space: nowrap;
                            word-break: break-all;
                            box-sizing: border-box;
                            overflow: hidden;
                            height: 20px;
                            line-height: 20px;
                            font-size: 10px;
                            padding: 0 6px;
                            width: 100%;
                            display: none;
                            &.show{
                              display: block;
                            }
                            &.openBtn,&.closeBtn{
                              display: block;
                              text-align: center;
                              cursor: pointer;
                            }

                          }
                        }

                      }
                    }
                  }
                  &:last-child{
                    border-right: 0;
                  }
                }
              }

            }
          }
        }
      }
    }
    .schedule-table-hidden{
      left: -9999px;
      top: -9999px;
      z-index: -1;
      position: absolute;
      .schedule-table{
        padding-left: 0;
        .schedule-table-detail{
          table{
            table-layout: auto !important;
          }
        }
        .table-cell{
          min-height: 64px;
          min-width: 160px;
          position: static !important;
        }
        .table-day{
          position: absolute;
          top: 0;
          right: 0;
        }
      }
    }
  }
}

@media screen and (min-height: 950px) {
  .schedule-table-detail td,.schedule-table-detail .ivu-table-cell{
    height: 53px !important;
  }
}
